<!DOCTYPE html>
<html lang="en" xmlns:>
<head>
    <meta charset="UTF-8">
    <title>{{ user.name }}'s BookList</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}" type="text/css">
    <link rel="stylesheet" href="//cdnjs.loli.net/ajax/libs/mdui/0.4.3/css/mdui.min.css">
    <link rel="icon" href={{ url_for('static', filename="logo.png") }}>
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

</head>
<body  class="mdui-theme-primary-indigo mdui-theme-accent-pink">
{#  <div class="mdui-drawer" id="left-drawer">#}
{#    ... drawer content ...#}
{#  </div>#}
<div class="mdui-toolbar mdui-color-theme mdui-shadow-7 mdui-m-b-2">
    <span class="mdui-typo-title">MyBookList</span>
    <div class="mdui-toolbar-spacer"></div>
    <a class="mdui-btn mdui-btn-icon"  mdui-tooltip="{content: '首页'}" href={{ url_for('index') }} ><i class="mdui-icon material-icons">home</i></a>
    {% if not current_user.is_authenticated %}
    <a class="mdui-btn mdui-btn-icon" mdui-tooltip="{content: '登录'}" href={{ url_for('login') }}>
        <i class="mdui-icon material-icons">person</i></a>
    {% else %}
    <a class="mdui-btn mdui-btn-icon" mdui-tooltip="{content: '设置'}" href={{ url_for('settings') }}>
        <i class="mdui-icon material-icons">settings</i></a>
    <a class="mdui-btn mdui-btn-icon" mdui-tooltip="{content: '登出'}" onclick="return confirm('确定要退出吗？')" href={{ url_for('logout') }}>
        <i class="mdui-icon material-icons">exit_to_app</i></a>
    {% endif %}
    <a href="https://github.com/DavinciEvans" mdui-tooltip="{content: 'Github'}" class="mdui-btn mdui-btn-icon"><svg version="1.1" id="Layer_1"
                                                                                  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                                                                                  viewBox="0 0 36 36" enable-background="new 0 0 36 36" xml:space="preserve" class="mdui-icon"
                                                                                  style="width: 24px;height:24px;">
        <path fill-rule="evenodd" clip-rule="evenodd" fill="#ffffff" d="M18,1.4C9,1.4,1.7,8.7,1.7,17.7c0,7.2,4.7,13.3,11.1,15.5
                c0.8,0.1,1.1-0.4,1.1-0.8c0-0.4,0-1.4,0-2.8c-4.5,1-5.5-2.2-5.5-2.2c-0.7-1.9-1.8-2.4-1.8-2.4c-1.5-1,0.1-1,0.1-1
                c1.6,0.1,2.5,1.7,2.5,1.7c1.5,2.5,3.8,1.8,4.7,1.4c0.1-1.1,0.6-1.8,1-2.2c-3.6-0.4-7.4-1.8-7.4-8.1c0-1.8,0.6-3.2,1.7-4.4
                c-0.2-0.4-0.7-2.1,0.2-4.3c0,0,1.4-0.4,4.5,1.7c1.3-0.4,2.7-0.5,4.1-0.5c1.4,0,2.8,0.2,4.1,0.5c3.1-2.1,4.5-1.7,4.5-1.7
                c0.9,2.2,0.3,3.9,0.2,4.3c1,1.1,1.7,2.6,1.7,4.4c0,6.3-3.8,7.6-7.4,8c0.6,0.5,1.1,1.5,1.1,3c0,2.2,0,3.9,0,4.5
                c0,0.4,0.3,0.9,1.1,0.8c6.5-2.2,11.1-8.3,11.1-15.5C34.3,8.7,27,1.4,18,1.4z"></path>
    </svg></a>
</div>

<div class="mdui-container">
        {% for message in get_flashed_messages() %}
        {% if message == '添加书籍成功！' or message == "数据已更新！" or message=="登录成功" or message=="设置成功！" or message=="Goodbye." %}
        <div class="alert alert-success alert-dismissable mdui-m-t-1">
        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
            &times; </button>
        {{ message }}</div>
        {% else %}
            <div class="alert alert-danger alert-dismissable mdui-m-t-1">
        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">
            &times; </button>
        {{ message }}</div>
        {% endif %}
        {% endfor %}
    <div class="mdui-row">
        <div class="mdui-col-sm-1 mdui-col-xs-3">
            <img alt="avatar" class="mdui-img-circle mdui-center mdui-img-fluid" src={{ url_for('static', filename='avatar.jpg') }}></div>
        <div class="mdui-col-sm-6 mdui-col-xs-6"><h1 class="mdui-m-t-3">{{ user.name }}'s BookList</h1></div></div>

    {% block content %}
    {% endblock %}
    <footer>
        <div class="mdi-col-xs-12 mdui-typo-caption-opacity mdui-m-t-4" style="text-align: center;">
            <p class="mdui-typo">&copy; 2020 by <a href="davincievans.top">DavinciEvans</a></p></div>
        <div class="mdui-row mdui-float-right">
            <img src={{ url_for('static', filename='animate.gif') }} alt="animate"/></div>
    </footer>
</div>
<!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
    <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<!-- 包括所有已编译的插件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="//www.mdui.org/source/dist/js/mdui.min.js"></script>
</body>
</html>